<div class="loading-container"><div class="loader"></div></div>

<div class="loading-waiter">
	<div class="loader">
		<div class="texting">请稍后...</div>
		<div class="spinner">
		  <div class="rect1"></div>
		  <div class="rect2"></div>
		  <div class="rect3"></div>
		  <div class="rect4"></div>
		  <div class="rect5"></div>
		</div>
	</div>
</div>

<div class="wrapper wrapper-shadow wrapper-list">
	<!-- list data wrapper -->
	<div class="result-wrapper no-padding">
   	<div class="result-body">
   		<div class="tabs">
				<ul class="nav nav-tabs widget no-margin-bottom">
					<li class="active">
						<a href="#tab-content" data-toggle="tab" onclick="handlerToggle('早教')" data-type="早教" data-table-target="#table-classes" data-form-search="#search-form-classes"> 
							<span class="menu-icon"><i class="fa fa-user-plus"></i></span> 早教班级
						</a>
					</li>
					<li>
						<a href="#tab-content" data-toggle="tab" onclick="handlerToggle('托班')" data-type="托班" data-table-target="#table-classes" data-form-search="#search-form-classes"> 
							<span class="menu-icon"><i class="fa fa-user-plus"></i></span> 托班班级
						</a>
					</li>
					<li>
						<a href="#tab-content" data-toggle="tab" onclick="handlerToggle('deletedZ')" data-type="已删除早教班级" data-table-target="#table-classes" data-form-search="#search-form-classes"> 
							<span class="menu-icon"><i class="fa fa-stop-circle-o"></i></span> 已删除早教班级
						</a>
					</li>
					<li>
						<a href="#tab-content" data-toggle="tab" onclick="handlerToggle('deletedT')" data-type="已删除托班班级" data-table-target="#table-classes" data-form-search="#search-form-classes"> 
							<span class="menu-icon"><i class="fa fa-stop-circle-o"></i></span> 已删除托班班级
						</a>
					</li>
				</ul>
				<div class="tab-content no-border xs-padding">
         	<div class="tab-pane active" id="tab-content">
         		<div id="toolbar">
         			<div class="btn-group" id="btn-group-add">
         				<button type="button" class="btn btn-primary" onclick="handlerCreate(this, null, handlerType);" data-editor-type='add'>
			        		<i class="glyphicon glyphicon-plus"></i> 新增
					    	</button>
         			</div>
         			<div class="btn-group" id="btn-group-weeks">
						    <button type="button" class="btn btn-default dropdown-toggle" data-toggle="dropdown" aria-haspopup="true" aria-expanded="false">
	    						<i class="glyphicon glyphicon-calendar"></i> 班级筛选 <span class="caret"></span>
							  </button>
							  <ul class="dropdown-menu">
							    <li><a href="javascript:void(0);" onclick="handlerWeek(this);">周一</a></li>
							    <li><a href="javascript:void(0);" onclick="handlerWeek(this);">周二</a></li>
							    <li><a href="javascript:void(0);" onclick="handlerWeek(this);">周三</a></li>
							    <li><a href="javascript:void(0);" onclick="handlerWeek(this);">周四</a></li>
							    <li><a href="javascript:void(0);" onclick="handlerWeek(this);">周五</a></li>
							    <li><a href="javascript:void(0);" onclick="handlerWeek(this);">周六</a></li>
							    <li><a href="javascript:void(0);" onclick="handlerWeek(this);">周日</a></li>
							  </ul>
						  </div>
						</div>
           	<table data-ajax="handlerSearch" 
         					 data-method="post" 
									 data-search="true" 
									 data-toolbar="#toolbar" 
								 	 data-id-field="id" 
								 	 data-unique-id="id" 
									 data-pagination="true" 
									 data-show-toggle="true" 
									 data-show-refresh="true" 
									 data-show-columns="true" 
									 data-check-on-init="true" 
									 data-click-to-select="false" 
									 data-side-pagination="server" 
									 data-mobile-responsive="true" 
									 data-event-onload="handlerSuccess" 
									 data-form-search="#search-form-classes" id="table-classes" class="bootstrap-table">
							<thead>
								<tr>
									<th data-checkbox="true"></th>
									<th data-field="id" data-visible="false" data-switchable="false">ID</th>
									<th data-field="name" 			data-align="center" >班级名称</th>
									<th data-field="createDate" data-align="center" >开班时间</th>
									<th data-field="teacher" 		data-align="center" >负责老师</th>
									<th data-field="room" 			data-align="center" >所在教室</th>
									<th data-field="students" 	data-align="center" >学员数</th>
									<th data-field="toplimit" 	data-align="center" >学员上限</th>
									<th data-field="operator" 	data-align="center" data-width="80" data-formatter="renderOperator" data-table-target="classes">操作</th>
								</tr>
							</thead>
						</table>
        	</div>
      	</div>
    	</div>
   	</div>
	</div>

	<!-- form editor wrapper -->
	<div class="editor-wrapper">
		
	</div>
</div>
<!-- PAGE CONTENT END =============================================== -->

<!-- 提交 表单 ========================================================= -->
<form id="editor-form-leave" action="/miwawa/{dbname}/common/save" method="post" 
			name="com.app.miwawa.api.eam.entity.StudentLeave">
			<input type="hidden" name="bean['parent']" id="parent"/>
			<input type="hidden" name="bean['status']" value="0"/>
			<input type="hidden" name="bean['invalid']" value="F"/>
</form>
<!-- 查询 表单 ========================================================= -->
<form id="search-form-classestime" action="/miwawa/{dbname}/common/search.json" method="post" 
			name="com.app.miwawa.api.eam.entity.ClassesTime">
			<input type="hidden" name="status" value="0" data-search-group="and" data-search-operation="EQ"/>
			<input type="hidden" name="invalid" value="F" data-search-group="and" data-search-operation="EQ"/>
			<input type="hidden" name="classesId" value="0" data-search-group="and" data-search-operation="EQ"/>
</form>
<form id="search-form-classes" action="/miwawa/{dbname}/common/search.json" method="post" 
			name="com.app.miwawa.api.eam.entity.view.ClassesView">
			<input type="hidden" name="type" value="早教" data-search-group="and" data-search-operation="EQ"/>
			<input type="hidden" name="status" value="0" data-search-group="and" data-search-operation="EQ"/>
			<input type="hidden" name="invalid" value="F" data-search-group="and" data-search-operation="EQ"/>
</form>
<form id="search-form-teacher" action="/miwawa/{dbname}/common/search.json" method="post" 
			name="com.app.miwawa.api.eam.entity.view.ClassesTeacher">
			<input type="hidden" name="classesid" value="0" data-search-group="and" data-search-operation="EQ"/>
</form>
<form id="search-form-exclude" action="/miwawa/{dbname}/common/search.json" method="post" 
			name="com.app.miwawa.api.eam.entity.view.RecordView">
			<input type="hidden" name="classesId" value="0" data-search-group="and" data-search-operation="EQ"/>
			<input type="hidden" name="year" value="0"  data-search-group="and" data-search-operation="EQ"/>
			<input type="hidden" name="month" value="0" data-search-group="and" data-search-operation="EQ"/>
			<input type="hidden" name="status" 	value="0" data-search-group="and" data-search-operation="EQ"/>
			<input type="hidden" name="invalid" value="F" data-search-group="and" data-search-operation="EQ"/>
			<input type="hidden" data-search-sort="checkDate" 	data-search-order="desc"/>
</form>
<!-- 删除 表单 ========================================================= -->
<form id="remove-form-classes" action="/miwawa/{dbname}/common/remove" method="post" name="com.app.miwawa.api.eam.entity.Classes"></form>
<form id="remove-form-exclude" action="/miwawa/{dbname}/common/remove" method="post" name="com.app.miwawa.api.eam.entity.ClassesRecord"></form>

<!-- Javascript ===================================================== -->
<script src="/miwawa/resources/lib/miwawa/1.0.2/js/core/requirejs/require.js"></script>

<script th:inline="javascript">
/*<![CDATA[*/
<!--
	var auths = /*[[${data.result.auths}]]*/;
	var authstr = "";
	
	/* ===================================== */
	/* 列表页面 */
	/* ===================================== */
	
	jQuery(function(){
		require(['/miwawa/resources/lib/miwawa/1.0.2/js/core/module/app/simple.js?'+Date.parse(new Date()),'moment'], function(simple,moment){
			simple(['registerForm','registerTable','registerWidget']);
			$moment = moment;
		});
		
		var array = [];
		for(var i in auths){
			array.push(auths[i].code);
		}
		authstr = array.join(",");
	});
	
	// 复课
	var typemap = {
		"托班":{"add":"/miwawa/content/eam/classes/editor/add-dc.html?"+Date.parse(new Date()),"edit":"/miwawa/content/eam/classes/editor/edit-dc.html?"+Date.parse(new Date())},
		"早教":{"add":"/miwawa/content/eam/classes/editor/add-ee.html?"+Date.parse(new Date()),"edit":"/miwawa/content/eam/classes/editor/edit-ee.html?"+Date.parse(new Date())}
	};
	
	// 打开新增或管理界面时的回调
	// 用于根据不同的班级类型加载不同界面
	function handlerType(trigger){
		var type = jQuery(".result-wrapper .nav-tabs .active>a").data("type");
		var edit = jQuery(trigger).data("editor-type");
		
		jQuery(".editor-wrapper").template("loader",{
			"tempurl":typemap[type][edit],
			"onLoaded":function(){
				jQuery(":hidden[name='type']",".form-editor-classes").val(type);
			}
		}).parent().addClass("editor-wrapper-open");
	}
	
	// 列表标签状态切换
	function handlerToggle(value){		
		// 设置查询参数
		if(value == "deletedZ"){
			jQuery(":hidden[name='type']","#search-form-classes").val("早教");
			jQuery(":hidden[name='invalid']","#search-form-classes").val("T");
			jQuery(".btn-group").hide(); 
		}else if(value == "deletedT"){
			jQuery(":hidden[name='type']","#search-form-classes").val("托班");
			jQuery(":hidden[name='invalid']","#search-form-classes").val("T");
			jQuery(".btn-group").hide();
		}else if(value == "早教"){
			jQuery(":hidden[name='type']","#search-form-classes").val(value);
			jQuery(":hidden[name='invalid']","#search-form-classes").val("F");
			jQuery(".btn-group").show();
		}else{
			jQuery(":hidden[name='type']","#search-form-classes").val(value);
			jQuery(":hidden[name='invalid']","#search-form-classes").val("F");
			jQuery("#btn-group-add").show();
			jQuery("#btn-group-weeks").hide();
		}
		jQuery("#table-classes").bootstrapTable('refreshOptions',{"searchText":null});
		jQuery("#table-classes").bootstrapTable('refresh');
		
	}
	
	// 按周几筛选班级
	function handlerWeek(trigger){
		jQuery("#table-classes").bootstrapTable('refreshOptions',{"searchText":trigger.innerText});
	}
	
	// 渲染班级学员列表的当天签到情况
	function renderStatus(value, row, index){
		return value ? '<a class="btn '+(value == '上课'?'btn-success':'btn-danger')+' btn-xs">'+value+","+row.checkDetail+'</a>' : value;
	}
	
	// 渲染班级列表操作列
 	function renderOperator(value, row, index){
		switch(this.tableTarget){
			case "classes":
				switch(row.invalid){
					case "F":
						return "<a class='btn btn-primary btn-xs btn-table-op' onclick='handlerCreate(this, \""+row.id+"\", handlerType)' data-table-source='#table-classes' data-editor-type='edit'> 管理 </a>"
							   + "<a class='btn btn-danger 	btn-xs btn-table-op' onclick='handlerClose(this, \""+row.id+"\")' data-table-source='#table-classes' data-form-source='#remove-form-classes' data-toggle='tooltip' data-placement='top' title='删除' > <i class='fa fa-trash'></i> </a>";
					case "T":
						return "<a class='btn btn-success btn-xs btn-table-op' onclick='handlerOpen(this,\""+row.id+"\")' data-table-source='#table-classes' data-form-source='#reback-form-classes' data-toggle='tooltip' data-placement='top' title='恢复'> <i class='fa fa-reply'></i> </a>";
				}		 
			case "teacher":
				return	row.id == "edit" ? value : 
								"<a class='btn btn-info	  btn-xs btn-table-op' onclick='handlerUpdate(this, \""+index+"\")' data-table-source='#table-teacher' data-rowdata='"+JSON.stringify(row)+"' data-toggle='tooltip' data-placement='top' title='修改'> <i class='ion-compose'></i> </a>" 
							+ "<a class='btn btn-danger btn-xs btn-table-op' onclick='handlerDelete(this, \""+index+"\")' data-table-source='#table-teacher' data-rowdata='"+JSON.stringify(row)+"' data-toggle='tooltip' data-placement='top' title='删除'> <i class='fa fa-trash'></i> </a>";;
			case "exclude":
				if(row.id == "new" || row.id == "edit"){
					return value;
				}else{
					return "<a class='btn btn-info	 btn-xs btn-table-op' id='edited' onclick='editExclude(this,\""+index+"\")' data-table-source='#table-exclude' data-rowdata='"+JSON.stringify(row)+"' data-toggle='tooltip' data-placement='top' title='修改'> <i class='ion-compose'></i> </a>"
							 + "<a class='btn btn-danger btn-xs btn-table-op' data-toggle='tooltip' data-placement='top' title='删除' onclick='handlerRemove(this, \""+row.id+"\")' data-table-source='#table-exclude' data-form-source='#remove-form-exclude'> <i class='fa fa-trash'></i> </a>";
				}
		}
	}  
	
	function handlerClose(button, rowid){
		jQuery.message.confirm("确定要删除该班级么，删除后的班级可在已删除班级中恢复",function(confirm){
			if(confirm){
				jQuery.ajaxsend({
					url:("/miwawa/{dbname}/classes/remove/{id}".replace("{dbname}",dbname)).replace("{id}",rowid),
					success:function(data){
						if(!data.error) {
							jQuery.message.success("所选班级已删除");
							jQuery(button).tooltip("destroy");
							jQuery("#table-classes").bootstrapTable("refresh");
						}else{
							jQuery.message.warning(data.error);
						}
					}
				});
			}
		});
	}
	
	function handlerOpen(button, rowid){
		jQuery.ajaxsend({
			url:("/miwawa/{dbname}/classes/reback/{id}".replace("{dbname}",dbname)).replace("{id}",rowid),			
			success:function(data){
				if(!data.error) {
					jQuery.message.success("所选班级已还原");
					jQuery(button).tooltip("destroy");
					jQuery("#table-classes").bootstrapTable("refresh");
				}else{
					jQuery.message.warning(data.error);
				}
			}
		});
	}
	
	/* ===================================== */
	/* 编辑页面 */
	/* ===================================== */
	
	// 创建输入框
	function createInput(name, type, ext, value){
		switch(type){
			case 'text': 
				var input = "";
				if(value != undefined){
					input = '<input name="'+name+'" type="'+type+'" id="'+name+'" class="form-control '+ext+'" value="'+value+'">';
				}else{
					input = '<input name="'+name+'" type="'+type+'" id="'+name+'" class="form-control '+ext+'">';
				}
			return input;
			case 'number': 
				return '<input name="'+name+'" id="'+name+'" type="'+type+'" class="form-control '+ext+'" value="'+(value ? value : '10.00')+'">';
			case 'select': 
				return '<select name="'+name+'" id="'+name+'" class="form-control">'
							+	'<option '+(value == '按课时' ? 'selected="selected"' : '')+' value="按课时">按课时</option>'
							+ '<option '+(value == '按人头' ? 'selected="selected"' : '')+' value="按人头">按人头</option>'
							+'</select>';
		}
	}
	
	// 创建按钮
	function createButton(target){
		switch(target){
			case "#table-teacher":
				return ""
							+"<span class='table-editor-tools'>"
							+"	<button type='button' class='btn btn-danger  btn-xs' onclick='handlerCancelRow(\""+target+"\", true);' data-toggle='tooltip' data-placement='top' title='取消'><i class='icon ion-close-circled'></i></button>"
							+"	<button type='button' class='btn btn-success btn-xs' onclick='handlerSubmitRow(\""+target+"\",\"setFormData\");' data-toggle='tooltip' data-placement='top' title='确认'><i class='icon ion-checkmark-circled'></i></button>"
							+"</span>";
			case "#table-exclude":
				return ""
							+"<span class='table-editor-tools'>"
							+"	<button type='button' class='btn btn-danger  btn-xs' onclick='handlerCancelRow(\""+target+"\", true);' data-toggle='tooltip' data-placement='top' title='取消'><i class='icon ion-close-circled'></i></button>"
							+"	<button type='button' class='btn btn-success btn-xs' onclick='handlerSubmitRow(\""+target+"\", null, \"handlerSubmited\");' data-toggle='tooltip' data-placement='top' title='确认'><i class='icon ion-checkmark-circled'></i></button>"
							+"</span>";
		}
	}
	
	// 提交行编辑前，设置表单数据
	function setFormData(dest, orig){
		jQuery("#teacherid", orig).val(teacher.teacherid);
		jQuery("#classesid", orig).val(teacher.classesid);
		return true;
	}
	
	// 提交行编辑后回调
	function handlerSubmited(result){
		if(result && result.resultCode && result.resultCode == "400"){
			jQuery.message.alert(result.resultMessage);
		}
	}
	
	// 更新负责老师收费项
	var teacher;
	function handlerUpdate(trigger, index){
		jQuery("[data-toggle='tooltip']","#table-teacher").tooltip("destroy");
		
		var _opts = jQuery(trigger).data();
		teacher = _opts.rowdata;
		
		jQuery("#table-teacher").bootstrapTable("updateRow",{
			index: index,
			row: createEditRow(_opts.rowdata, _opts.tableSource)
		});
		
		function createEditRow(row, target){
			jQuery(target).append("<input type='hidden' name='id' value='"+row.chargeid+"'>");
			
			return {
				id:   		"edit",
	      name: 		row.name,
	      sex: 			row.sex,
	      mobile: 	row.mobile,
	      method: 	createInput('method',	'select', 'ext-text', row.method),
	      amount: 	createInput('amount',	'number', 'ext-text', row.amount),
	      operator: createButton(target)
			};
		}
		
		jQuery("[data-toggle='tooltip']","#table-teacher").tooltip({html:true, container:"html", trigger:'hover'});
	}
	
	// 删除负责老师
	function handlerDelete(trigger, index){
		var _opts = jQuery(trigger).data(), rowdata = _opts.rowdata;
		jQuery.ajaxsend({
			url:"/miwawa/{dbname}/classes/relation/delete".replace("{dbname}",dbname),
			data:{
				"id":rowdata.id,
				"teacherid":rowdata.teacherid,
				"classesid":rowdata.classesid,
				"chargeid":rowdata.chargeid
			},
			success:function(data){
				if(data && data["success"]) {
					jQuery("#table-teacher").bootstrapTable("refresh");
				}
			}
		});
	}
	
	/* ===================================== */
	/* 表格 行编辑 开始 */
	/* ===================================== */
	// 添加行编辑
	function handlerAddRow(target){
		var $table = jQuery(target);
		
		if(!hasEditorRow()){
			$table.bootstrapTable('insertRow', {index: 0, row: {
				id:'new',
				checkDate: 	createInput('checkDate', 'text', 'ext-date'),
        students: 	createInput('students', 'number', 'ext-text', jQuery("#table-student").bootstrapTable("getData").length),
        operator: 	createButton(target)
			}});
			
			setTimeout(function(){
				require(['jquery.plugin.form'],function(form){
					form.datepicker(".ext-date",{format: "YYYY-MM-DD",daysOfWeekDisabled:jQuery.utils.daysOfWeekDisabled[jQuery("#lessonWeek").val()]});
				});
			},0);
		}
		
		// 判断是否有编辑行
		function hasEditorRow(){
			return $table.bootstrapTable('getRowByUniqueId', 'new') ? true : false;
		}
	}
	
	//修改应到记录
	var exclude;
	function editExclude(trigger,index){
		jQuery("[data-toggle='tooltip']","#table-exclude").tooltip("destroy");
		
		var _opts = jQuery(trigger).data();
		exclude = _opts.rowdata;
		
		jQuery("#table-exclude").bootstrapTable("updateRow",{
			index: index,
			row: editedRows(_opts.rowdata, _opts.tableSource)
		});
		
		//修改
		function editedRows(row,target){
			return {
				id:   			"edit",
				checkDate: 	row.checkDate,
		    students: 	createInput('students', 'number', 'ext-text', jQuery("#table-student").bootstrapTable("getData").length),
		    operator: 	createdButtons()
			};
		}
	}
	
	//创建保存或取消应到设置按钮
	function createdButtons(){
		return ""
			+"<span class='table-editor-tools'>"
			+"	<button type='button' class='btn btn-danger  btn-xs' onclick='handedcancel()' title='取消'><i class='icon ion-close-circled'></i></button>"
			+"	<button type='button' class='btn btn-success btn-xs' onclick='updateExclude(exclude)' title='确认'><i class='icon ion-checkmark-circled'></i></button>"
			+"</span>";
	}
	
	//更新应到人数
 	function updateExclude(exclude){
	 	jQuery.ajaxsend({
	 		url:"/miwawa/{dbname}/classes/record/update".replace("{dbname}", dbname),
	 		data:{
					"classesId":exclude.classesId,
					"checkDate":exclude.checkDate,
					"students":jQuery("#students").val()
	 		},
	 		success:function(data){
					jQuery("#table-exclude").bootstrapTable("refresh");
	 		}
		});
	}
 	
	//取消更新应到人数
	function handedcancel(){
		jQuery("#table-exclude").bootstrapTable("refresh");
	}
	
	//检查上课周期 和 上课时间
	function checkTime(botton, table, form){
		var list = ["周一","周二","周三","周四","周五","周六","周日"];
		var fromWeek = jQuery("#fromWeek",form).val();
		var overWeek = jQuery("#overWeek",form).val();
		var fromTime = $moment("2016-09-28 "+jQuery("#fromTime",form).val()+":00");
		var overTime = $moment("2016-09-28 "+jQuery("#overTime",form).val()+":00");
		var from, over;
		for(var i = 0; i<list.length; i++){
			if(list[i] == fromWeek){
				from = i;
			}
			if(list[i] == overWeek){
				over = i;
			}
		}
		if(from >= over){
			jQuery.message.alert("上课周期信息有误，请重新选择");
			return;
		}else{
			if(!overTime.isAfter(fromTime)){
				jQuery.message.alert("上课时间信息有误，请重新选择");
				return;
			}else{
				handlerSubmit(botton, table, form);
			}
		}
	}
	
	function handlerFilter(){
		var array = jQuery("#yearMonth").val().split("-");
		jQuery(":hidden[name='year']").val(array[0]);
		jQuery(":hidden[name='month']").val(array[1]);
		jQuery("#table-exclude").bootstrapTable("refresh");
	}
//-->
/*]]>*/ 
</script>
		